<template>
    <el-card  v-loading="result.loading">
      <template v-slot:header>
        <ms-table-header :condition.sync="condition" @search="initData"
                         :title="$t('test_track.plan_view.report_template')"
                         :create-tip="$t('test_track.plan_view.create_template')" @create="templateEdit">
        </ms-table-header>
      </template>

      <testcase-template-item v-for="item in templates" :key="item.id"
                              :template="item" @templateEdit="templateEdit" @refresh="initData"/>

      <test-case-report-template-edit ref="templateEdit" @refresh="initData"/>

    </el-card>
</template>

<script>

import MsTableHeader from "../../common/components/MsTableHeader";
import TestCaseReportTemplateEdit from "../../track/plan/view/comonents/report/TestCaseReportTemplateEdit";
import TestcaseTemplateItem from "../../track/plan/view/comonents/report/TestcaseTemplateItem";
import MsMainContainer from "../../common/components/MsMainContainer";
import {getCurrentWorkspaceId} from "@/common/js/utils";

export default {
  name: "TestCaseReportTemplate",
  components: {MsMainContainer, TestcaseTemplateItem, TestCaseReportTemplateEdit, MsTableHeader},
  data() {
    return {
      result: {},
      condition: {},
      templates: []
    };
  },
  mounted() {
        this.initData();
      },
      watch: {
        '$route'(to) {
          if (to.path.indexOf("setting/testcase/report/template") >= 0) {
            this.initData();
          }
        }
      },
      methods: {
        initData() {
          this.condition.workspaceId = getCurrentWorkspaceId();
          this.result = this.$post('/case/report/template/list', this.condition, response => {
            this.templates = response.data;
          });
        },
        templateEdit(id) {
          this.$refs.templateEdit.open(id);
        }
      }
    }
</script>

<style scoped>

  .el-card {
    min-height: 300px;
  }

</style>
